﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <link href="../Styles/LayoutStyleSheet.css" rel="stylesheet" type="text/css" />
    <link href="../Styles/BoozePortThems.css" rel="stylesheet" type="text/css" />
    <script src="../Scripts/JScript.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#DivLoginForm").show();
            $("#DivSignUp").hide();
            $("#lnkSignUp").on("click", function () {
                $("#DivLoginForm").hide();
                $("#DivSignUp").show();
            });
        });
    </script>
</head>
<body class="Form">
<div style='background:rgba(000,000,000,0.8);height:710px;width:auto; overflow:hidden'>
    <div id="header">
         <div id="Logo" style="float: left; margin: 8px 0 0 75px">
            <a href="../Index.htm"><img src="../Images/BoozeLogo.jpg" /></a>
        </div>
        <div id="NavMenu" style="float: right">
           <ul id="menu">
                <li><a href="../Index.htm#Home">Home</a></li>
                <li><a href="../Index.htm#Feature">Feature</a></li>
                <li><a href="../Index.htm#About">About</a></li>
                <li><a href="../Index.htm#Team">Team</a></li>
                <li><a href="../Index.htm#Testimonial">Testimonial</a></li>
                <li><a href="../Index.htm#ContactUs">Contact Us</a></li>
                <li><a href="../Index.htm#Adds">Adds</a></li>
            </ul>
        </div>
    </div>
    <div id="Clear" style="clear: both">
    </div>
    <div id="DivLoginForm">
        <h1 style="color: #FFFFFF; padding-bottom: 5px; text-align: center">
            Login with Email</h1>
        <div id="DivLogin" style="float: left">
            <fieldset style="border: none; border-right: 1px solid #ccc;margin: 0px">
                <table cellpadding="5">
                    <tr>
                        <td>
                            <a>Email or Phone</a>
                            <br />
                            <input type="text" class="input" />
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <a>Password</a>
                            <br />
                            <input type="password" class="input" />
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <button type="button" class="CSSbutton" runat="server" style="height: 40px; width: 335px" onclick="window.location.href='../Pages/LiquidFeed.htm' ">
                                Login</button>
                        </td>
                    </tr>
                </table>
                <div id="DivForgotPassword" style="float: left; margin: 15px 0 0 5px">
                    <a href="#" style="color: #FFFFFF">Forgot Password or ID Provieder?</a>
                </div>
            </fieldset>
        </div>
        <div id="DivSocialMediaButton" style="float: left">
            <fieldset style="margin-top: 10px; border: none">
                <table cellpadding="8">
                    <tr>
                        <td>
                            <button type="button" class="btnFacebook" runat="server">
                            </button>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <button type="button" class="btnTwitter" runat="server">
                            </button>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <button type="button" class="btnGooglePlus" runat="server">
                            </button>
                        </td>
                    </tr>
                </table>
                <div style="text-align: left; margin: 10px 0 0 5px">
                    <a>Don't have BoozePort Live ID?</a> <a id="lnkSignUp" style="border: none;
                        outline: none; color: #fff; cursor: pointer; background-color: transparent; text-decoration: underline">
                        Sign Up</a>
                </div>
            </fieldset>
        </div>
    </div>
    <!-- ********************************************* Sign Up Div ***********************************************-->
    <div id="DivSignUp" runat="server">
        <table  cellspacing="5">
            <tr>
                <td>
                    <h1 style="margin:0px; color: #fff">
                        Sign Up</h1>
                </td>
            </tr>
            <tr>
                <td>
                    <input type="radio" name="group1" value="Individual" class="RadioButton" checked="checked" />
                    Individual &nbsp;&nbsp;&nbsp
                    <input type="radio" name="group1" value="Institution" class="RadioButton" />
                    Institution
                </td>
            </tr>
            <tr>
                <td>
                <div style="float:left;margin:0 8px 0 0">
                <a>First name</a>
                <br />
                    <input type="text" class="input" style="width:147px" />
                </div>
                <div style="float:left;margin:0px">
                <a>Surname</a>
                    <br />
                    <input type="text" class="input" style="width:147px"/>
                </div>
               </td>
            </tr>
            <tr>
                <td>
                <a>Email or mobile number</a>
                <br />
                    <input type="text" class="input" />
                </td>
            </tr>
            <tr>
                <td>
                <a>Re-enter email or mobile number</a>
                    <input type="text" class="input" />
                </td>
            </tr>
            <tr>
                <td>
                <a>New password</a>
                    <input type="password" class="input" />
                </td>
            </tr>
        </table>
        <table>
            <tr>
                <td>
                    <h2 style="margin: 10px 0 10px 0; color: #fff">
                        Birthday</h2>
                </td>
            </tr>
            <tr>
                <td>
                <select>
                <option value="Month" class="input">Month</option>
                </select>
                   <select>
                <option value="Day" class="input">Day</option>
                </select>
                <select>
                <option value="Year" class="input">Year</option>
                </select>
                </td>
            </tr>
            <tr>
                <td>
                <input type="radio" name="group1" value="Mail" class="RadioButton" checked="checked" />
                    Mail &nbsp;&nbsp;&nbsp
                    <input type="radio" name="group1" value="Femail" class="RadioButton" />
                    Femail
                </td>
            </tr>
            <tr>
                <td>
                    <div>
                        <a style="margin-top: 15px; font-size: 12px">By clicking Sign Up, you agree to our Terms
                            and that you have </a>
                        <br />
                        <a>read our Data Policy, including our Cookie Use.</a>
                    </div>
                    <br />
                    <div>
                        <button id="Button1" type="button" class="CSSbutton" runat="server" style="width: 150px;
                            height: 30px" onclick="window.location.href='../Pages/LiquidFeed.htm' ">
                            Sign Up</button>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                        <button type="button" class="CSSbutton" runat="server" style="width: 150px; height: 30px" onclick="window.location.href='../Index.htm' ">
                            Cancel</button>
                    </div>
                </td>
            </tr>
        </table>
    </div>
    </div>
</body>
</html>
